---
title: XataとAstro
description: サーバーレスデータベースをプロジェクトに追加し、Xataで全文検索を行いましょう。
type: backend
logo: xata
stub: false
i18nReady: true
---
import PackageManagerTabs from '~/components/tabs/PackageManagerTabs.astro'
import { FileTree } from '@astrojs/starlight/components';

[Xata](https://xata.io)は、リレーショナルデータベース、検索エンジン、分析エンジンの機能を組み合わせた**サーバーレスデータプラットフォーム**で、一貫したREST APIを公開します。

## Xataを使ったデータベースの追加

### 開発環境の準備

- [Xata](https://app.xata.io/signin)のアカウントとデータベースの作成（Web UIからサンプルデータベースを使用できます）
- アクセストークン (`XATA_API_KEY`)
- データベースのURL

[Xata CLI](https://xata.io/docs/getting-started/installation)を更新・初期化すると、`.env` にAPIキーが追記され、データベースURLも設定されます。

設定ファイルは以下のようになります。

```ini title=".env"
XATA_API_KEY=hash_key

# Gitブランチと同名のXataブランチが
# 存在しない場合に使用されるブランチ
XATA_BRANCH=main
```

`databaseUrl`は`.xatarc`ファイルで定義します。

```ini title=".xatarc"
{
  "databaseUrl": "https://your-database-url"
}
```

### 環境設定

環境変数に型安全性とIntelliSenseを持たせるため、`src/env.d.ts`を作成または編集します。

```ts title="src/env.d.ts"
interface ImportMetaEnv {
  readonly XATA_API_KEY: string;
  readonly XATA_BRANCH?: string;
}

interface ImportMeta {
  readonly env: ImportMetaEnv;
}
```

:::tip
[環境変数](/ja/guides/environment-variables/)と`.env`ファイルについて[こちら](/ja/guides/environment-variables/)を参照してください。
:::

Xata CLIの**コード生成**でTypeScriptを選択すると、データベーススキーマに合わせた型付きSDK (`@xata.io/client`) が生成・インストールされます。

環境変数とデータベースURLはSDKが自動取得するため、追加設定は不要です。

ここまでのプロジェクト構成です。

<FileTree title="Project Structure">
- src/
  - **xata.ts**
  - **env.d.ts**
- **.env**
- astro.config.mjs
- package.json
- **.xatarc**
</FileTree>

## クエリ作成

投稿（Posts）を取得する例です。`.astro`ファイルに`XataClient`をインポートし、最初の50件を取得します。

```astro title="src/pages/blog/index.astro"
---
import { XataClient } from '../../xata';
 
const xata = new XataClient({
  apiKey: import.meta.env.XATA_API_KEY,
  branch: import.meta.env.XATA_BRANCH
});

const { records } = await xata.db.Posts.getPaginated({
  pagination: {
    size: 50
  }
})
---

<ul>
  {records.map((post) => (
    <li>{post.title}</li>
  ))}
</ul>
```

スキーマを変更した場合は **必ずXata CLIでSDKを再生成**してください。生成ファイルを直接編集すると、再生成時に上書きされます。

## 公式リソース

- [Xata Astro Starter](https://github.com/xataio/examples/tree/main/apps/getting-started-astro)
- [Xata Docs: Quick Start Guide](https://xata.io/docs/getting-started/quickstart-astro)
